

<!DOCTYPE html>
<html lang="en">
<head>
    <meta charset="UTF-8">
    <meta name="viewport" content="width=device-width, initial-scale=1.0">
    <title>原生ajax</title>
</head>
<body>
    

    <script>
        // Ajax 即 “Asynchronous JavaScript and XML”（异步的 JavaScript 和 XML），是一门集合了html、css、js的局部刷新综合技术。
        // 它能够在不重新加载整个网页的情况下，与服务器进行数据交换并更新部分网页内容，提升用户体验。


        //原理：

        // 1：创建 XMLHttpRequest 对象：
        let  xhr = new XMLHttpRequest()//IE浏览器不用它    ActiveXObject("Microsoft.XMLHTTP")


        // 2:跟服务器建立连接
        xhr.open("get",`https://hmajax.itheima.net/api/books?creator=king`,true)

        // 3:跟服务器发送http请求 
        xhr.send()

        // 4:侦听事件  接受服务端返回的数据
        xhr.onreadystatechange = function () {
            if (xhr.readyState == 4 && xhr.status == 200) {
                let data = xhr.responseText
                console.log(data);
                
            }
        }

        // 5：根据返回的数据渲染页面


    </script>
</body>
</html>